@use "sass:math";


// 项目主题颜色和主题字体大小、颜色
$base-color: #567DF4;
$base-active-color: #6c91ff;
$base-font-color: #131414;
$base-header-color: #000000;
$base-header-size: 34rpx; // 统一使用 rpx 适配多端
$base-bg-color: #f2f7fd;
$body-bg-color: #33445c;
$border-color: #eaeaf0;

$success-color: #6ad97b;
$warning-color: #f9931f;
$danger-color: #eb5757;

// 基础字体大小（UniApp 推荐使用 rpx 作为基准单位）
$baseFontSize: 50rpx;

// 单位转换函数（统一转为 rpx，适配小程序和 H5）
@function px2rpx($px) {
  @return math.div($px, $baseFontSize) * 1rpx;
}

// 主题色透明度处理
@function general-bg-color($alpha) {
  @return rgba(86, 125, 244, $alpha);
}
@function general-font-color($alpha) {
  @return rgba(34, 33, 91, $alpha);
}

// Flex 布局混合宏
@mixin flex($a, $b, $c) {
  flex: $a $b math.div($c, $baseFontSize) * 1rpx;
}

// 边框圆角
@mixin b-radius($px) {
 border-radius: math.div($px, $baseFontSize) * 1rpx;
}

@mixin h($px) {
  height: math.div($px, $baseFontSize) * 1rpx;
}
@mixin minh($px) {
  min-height: math.div($px, $baseFontSize) * 1rpx;
}
@mixin maxh($px) {
  max-height: math.div($px, $baseFontSize) * 1rpx;
}
@mixin w($px) {
  width: math.div($px, $baseFontSize) * 1rpx;
}

// 外边距
@mixin mt($px) {
  margin-top: math.div($px, $baseFontSize) * 1rpx;
}
@mixin mb($px) {
  margin-bottom: math.div($px, $baseFontSize) * 1rpx;
}
@mixin ml($px) {
  margin-left: math.div($px, $baseFontSize) * 1rpx;
}
@mixin mr($px) {
  margin-right: math.div($px, $baseFontSize) * 1rpx;
}

// 内边距
@mixin pt($px) {
  padding-top: math.div($px, $baseFontSize) * 1rpx;
}
@mixin pb($px) {
  padding-bottom: math.div($px, $baseFontSize) * 1rpx;
}
@mixin pl($px) {
  padding-left: math.div($px, $baseFontSize) * 1rpx;
}
@mixin pr($px) {
  padding-right: math.div($px, $baseFontSize) * 1rpx;
}

@mixin padding($tbpx, $lrpx) {
  padding: math.div($tbpx, $baseFontSize) * 1rpx math.div($lrpx, $baseFontSize) * 1rpx;
}
@mixin padding-rl($rightpx, $leftpx) {
  padding: 0rpx math.div($rightpx, $baseFontSize) * 1rpx 0rpx math.div($leftpx, $baseFontSize) * 1rpx;
}

@mixin margin($tbpx, $lrpx) {
  margin: math.div($tbpx, $baseFontSize) * 1rpx math.div($lrpx, $baseFontSize) * 1rpx;
}

// 1px 边框（适配高清屏，兼容多端）
@mixin border-1px($color) {
  position: relative;
  &::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: $color;
    transform-origin: 0 0;
    // 适配不同 dpr 屏幕
    @media (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) {
      transform: scaleY(0.5);
    }
    @media (-webkit-min-device-pixel-ratio: 3), (min-device-pixel-ratio: 3) {
      transform: scaleY(1/3);
    }
  }
}

@mixin border-right-1px($px, $color) {
  position: relative;
  &::after {
    // ... 其他属性
    width: math.div($px, $baseFontSize) * 1rpx;
    // ...
  }
}

@mixin border-left-1px($px, $color) {
  position: relative;
  &::after {
    // ... 其他属性
    width: math.div($px, $baseFontSize) * 1rpx;
    // ...
  }
}

@mixin border-top-npx($color, $height, $opacity) {
  position: relative;
  &::after {
    // ... 其他属性
    height: math.div($height, $baseFontSize) * 1rpx;
    // ...
  }
}

@mixin border-npx($color, $height) {
  position: relative;
  &::after {
    // ... 其他属性
    height: math.div($height, $baseFontSize) * 1rpx;
    // ...
  }
}

// 边框样式
@mixin border-solid($bw, $color) {
  border: math.div($bw, $baseFontSize) * 1rpx solid $color;
}
@mixin border-top-solid($bw, $color) {
  border-top: math.div($bw, $baseFontSize) * 1rpx solid $color;
}
@mixin border-right-solid($bw, $color) {
  border-right: math.div($bw, $baseFontSize) * 1rpx solid $color;
}
@mixin border-left-solid($bw, $color) {
  border-left: math.div($bw, $baseFontSize) * 1rpx solid $color;
}
@mixin border-bottom-solid($bw, $color) {
  border-bottom: math.div($bw, $baseFontSize) * 1rpx solid $color;
}

@mixin arrow-icon($size, $lw, $color) {
  position: relative;
  color: $color;
  &::after {
    // ... 其他属性
    width: math.div($size, $baseFontSize) * 1rpx;
    height: math.div($size, $baseFontSize) * 1rpx;
    border-top: math.div($lw, $baseFontSize) * 1rpx solid currentColor;
    border-right: math.div($lw, $baseFontSize) * 1rpx solid currentColor;
    // ...
  }
}

@mixin box-shadow($x, $y, $blur, $spread, $color) {
  box-shadow: 
    math.div($x, $baseFontSize) * 1rpx 
    math.div($y, $baseFontSize) * 1rpx 
    math.div($blur, $baseFontSize) * 1rpx 
    math.div($spread, $baseFontSize) * 1rpx 
    $color;
}
@mixin lh($px) {
  line-height: math.div($px, $baseFontSize) * 1rpx;
}

@mixin fs($px) {
  font-size: math.div($px, $baseFontSize) * 1rpx;
}

@mixin top($px) {
  top: math.div($px, $baseFontSize) * 1rpx;
}
@mixin left($px) {
  left: math.div($px, $baseFontSize) * 1rpx;
}
@mixin bottom($px) {
  bottom: math.div($px, $baseFontSize) * 1rpx;
}
@mixin right($px) {
  right: math.div($px, $baseFontSize) * 1rpx;
}

@mixin vertical($px) {
  vertical-align: math.div($px, $baseFontSize) * 1rpx;
}

@mixin mh($px) {
  min-height: math.div($px, $baseFontSize) * 1rpx;
}

@mixin wordspacing($px) {
  word-spacing: math.div($px, $baseFontSize) * 1rpx;
}
// 页面内容容器（兼容多端滚动）
.page-content {
  flex: 1;
  width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch; // iOS 平滑滚动
  overflow-y: scroll;
  // 修复小程序滚动穿透
  @at-root body {
    &.overscroll-hidden {
      overflow: hidden;
    }
  }
}